Notifications এর জন্য Expo Notifications API

Mobile App Development - রিঅ্যাক্ট নেটিভ (React Native) - Push Notifications এবং Background Tasks
213

Expo Notifications API একটি শক্তিশালী এবং সহজে ব্যবহৃত লাইব্রেরি, যা React Native অ্যাপ্লিকেশনগুলিতে পুশ নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়। Expo Notifications API বিশেষভাবে Expo managed workflow-এ কাজ করতে ডিজাইন করা হয়েছে, তবে আপনি bare workflow-এও এটি ব্যবহার করতে পারেন।

Expo Notifications API ব্যবহার করে আপনি পুশ নোটিফিকেশন পাঠাতে পারেন যা ব্যবহারকারীকে অ্যাপের নতুন আপডেট বা গুরুত্বপূর্ণ তথ্য জানিয়ে দেয়। এটি অনলাইন এবং অফলাইন উভয় অবস্থাতেই কাজ করে।

এখানে আমরা Expo Notifications API-এর সেটআপ এবং ব্যবহারের একটি বিস্তারিত গাইড প্রদান করব।


Expo Notifications API সেটআপ

প্রথমত, আপনাকে Expo Notifications প্যাকেজটি ইনস্টল করতে হবে। Expo Notifications API ব্যবহার করার জন্য expo-notifications লাইব্রেরি ইনস্টল করা আবশ্যক।

১. ইনস্টলেশন

expo install expo-notifications

২. Expo Permissions সেটআপ

নোটিফিকেশন পাঠানোর আগে আপনাকে পারমিশন নিতে হবে। একাধিক প্ল্যাটফর্মে পারমিশন প্রক্রিয়া আলাদা হতে পারে (iOS এবং Android)। তাই পারমিশন চাওয়ার আগে আপনাকে expo-permissions ব্যবহার করতে হতে পারে। তবে, Expo SDK 41 থেকে এটি expo-notifications এ বিল্ট-ইন ফিচার হিসেবে আছে।

৩. Import এবং Basic Configuration

import React, { useState, useEffect } from 'react';
import { Button, Platform } from 'react-native';
import * as Notifications from 'expo-notifications';
import * as Permissions from 'expo-permissions';

export default function App() {
  const [expoPushToken, setExpoPushToken] = useState('');
  const [notification, setNotification] = useState(false);
  
  // Notification Listener Setup
  useEffect(() => {
    const subscription = Notifications.addNotificationReceivedListener(notification => {
      setNotification(notification);
    });

    return () => subscription.remove();
  }, []);

  // Request Permission and Get Expo Push Token
  const getPermissionAndToken = async () => {
    // Request notification permissions
    const { status } = await Permissions.askAsync(Permissions.NOTIFICATIONS);
    if (status === 'granted') {
      const token = await Notifications.getExpoPushTokenAsync();
      setExpoPushToken(token.data);
      console.log(token.data);
    }
  };

  // Handle the notification when the app is in the background
  useEffect(() => {
    const responseListener = Notifications.addNotificationResponseReceivedListener(response => {
      console.log(response);
    });

    return () => responseListener.remove();
  }, []);

  return (
    <Button
      title="Get Notification Permission"
      onPress={getPermissionAndToken}
    />
  );
}

ব্যাখ্যা:

  • Permissions: প্রথমে আমরা ব্যবহারকারীর কাছ থেকে Notifications পারমিশন নিয়েছি।
  • Expo Push Token: ব্যবহারকারীকে অনুমতি দেওয়ার পর, Expo Push Token তৈরি করা হয়েছে যা আমাদের পুশ নোটিফিকেশন পাঠানোর জন্য প্রয়োজন।
  • Notification Listener: যখন ব্যবহারকারী নোটিফিকেশন পায়, তখন সেটা আমাদের অ্যাপে শো করবে।

Push Notification Sending via Expo

পুশ নোটিফিকেশন পাঠানোর জন্য, আপনাকে এক্সপো সার্ভিস থেকে Expo Push Token ব্যবহার করে নোটিফিকেশন পাঠানোর জন্য একটি সার্ভার তৈরি করতে হবে। Expo নিজেই Push Notification Service প্রদান করে, তাই আপনার সিস্টেমে পুশ নোটিফিকেশন পাঠাতে এক্সপো-এর push API ব্যবহার করা হয়।

পুশ নোটিফিকেশন পাঠানো

Expo Push Notification পাঠানোর জন্য, নিচের মত একটি API কল করতে হবে:

const sendPushNotification = async (expoPushToken) => {
  const message = {
    to: expoPushToken,
    sound: 'default',
    title: 'Hello',
    body: 'This is a test push notification',
    data: { someData: 'goes here' },
  };

  try {
    await fetch('https://exp.host/--/api/v2/push/send', {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(message),
    });
  } catch (error) {
    console.error('Error sending notification', error);
  }
};

এখানে:

  • to: এই প্রোপার্টিতে আমরা ব্যবহারকারীর Expo Push Token প্রদান করি।
  • sound: এটি একটি সাউন্ড ফাইল নির্দিষ্ট করে যা নোটিফিকেশন পাঠানোর সময় বাজবে।
  • title এবং body: নোটিফিকেশনের শিরোনাম এবং বডি সেট করা হয়।
  • data: এটি অ্যাডিশনাল তথ্য প্রদান করে, যা আপনি প্রক্রিয়াজাত করতে পারেন।

পুশ নোটিফিকেশন পাঠানোর উদাহরণ:

sendPushNotification(expoPushToken);

এখানে, expoPushToken হলো ব্যবহারকারীর সংগ্রহিত পুশ টোকেন, যা getExpoPushTokenAsync থেকে আসবে।


Expo Push Notifications Configuration for iOS

iOS-এ পুশ নোটিফিকেশন পাঠানোর জন্য আপনাকে APNs (Apple Push Notification Service) সেটআপ করতে হবে। Expo এর মাধ্যমে Expo Push Notifications এভাবে কাজ করবে।

  1. আপনার অ্যাপে Push Notification entitlement সক্রিয় করতে হবে।
  2. Expo অ্যাপের মাধ্যমে পুশ নোটিফিকেশন কাজ করার জন্য আপনার অ্যাপকে Push Notifications অনুমতি দিতে হবে।
  3. আপনি Apple Developer অ্যাকাউন্টের মাধ্যমে আপনার অ্যাপের জন্য APNs সার্টিফিকেট তৈরি করতে পারেন।

Expo Notifications API এর অন্যান্য ফিচার

  1. Push Notification Scheduling:
    আপনি পুশ নোটিফিকেশন ভবিষ্যতের জন্য Schedule করতে পারেন। উদাহরণস্বরূপ, 10 সেকেন্ড পরে একটি নোটিফিকেশন পাঠানো।

    const schedulePushNotification = async () => {
      await Notifications.scheduleNotificationAsync({
        content: {
          title: "Scheduled Notification",
          body: 'This is a scheduled notification.',
        },
        trigger: {
          seconds: 10,
        },
      });
    };
  2. Handling Notifications in Background:
    আপনি যখন অ্যাপটি ব্যাকগ্রাউন্ডে থাকে, তখনও নোটিফিকেশন শোনার জন্য সেটআপ করতে পারেন।

    Notifications.addNotificationResponseReceivedListener(response => {
      console.log('Notification received in background', response);
    });

সারাংশ

Expo Notifications API ব্যবহার করে React Native অ্যাপে পুশ নোটিফিকেশন সিস্টেম সেটআপ করা খুবই সহজ। এখানে কিছু মূল বিষয়:

  • পারমিশন: পুশ নোটিফিকেশন পাঠানোর আগে অবশ্যই ব্যবহারকারীর পারমিশন নিতে হবে।
  • Expo Push Token: পুশ নোটিফিকেশন পাঠানোর জন্য Expo Push Token প্রয়োজন।
  • Push API: Expo Push API ব্যবহার করে নোটিফিকেশন পাঠানো হয়।
  • Scheduled Notifications: নির্দিষ্ট সময় পরে নোটিফিকেশন পাঠানোর ব্যবস্থা।

Expo Notifications API দিয়ে আপনি real-time notifications, scheduled notifications, এবং background notifications ইত্যাদি সহজেই অ্যাপ্লিকেশনে যুক্ত করতে পারেন।

Content added By
Promotion
NEW SATT AI এখন আপনাকে সাহায্য করতে পারে।

Are you sure to start over?

Loading...